<template>
	<view class="w-100">
		<view class="flex-1 mx-3">
			<view class="flex-1 row mt-3 font-s-7 font-w">{{ newInfo.title }}</view>
			<view class="flex-1 row mt-2 font-s-4 text-light-muted">{{ newInfo.describe }}</view>
			<view class="flex-1 row-ac justify-end">
				<view @click="copyContent">复制文案</view>
			</view>
			<view class="mt-4">
				<rich-text :nodes="newInfo.content" class="rich-text"></rich-text>
			</view>

		</view>
	</view>
</template>

<script>
	import {
		newsDetailUrl
	} from '@/api/article.js';
	export default {
		data() {
			return {
				copywritingId: '',
				newInfo: ''
			}
		},
		onLoad(options) {
			this.copywritingId = options.copywritingId
			this.getArticleDetail()
		},
		methods: {
			getArticleDetail() {
				this.$R.get(newsDetailUrl + this.copywritingId + '/').then(res => {
					if (res.code == 200) {
						this.newInfo = res.data
						console.log(this.newInfo);
					}
				})
			},
			copyContent() {
				const contentToCopy = this.newInfo.content
				// 使用正则表达式去除HTML标签
				const textOnly = contentToCopy.replace(/<[^>]+>/g, '')
				// 使用 uni-clipboard 组件的 API 将内容复制到剪贴板
				uni.setClipboardData({
					data: textOnly,
					success: function() {
						uni.showToast({
							title: '已复制',
							icon: 'success'
						})
					},
					fail: function() {
						uni.showToast({
							title: '复制失败，请重试',
							icon: 'none'
						})
					}
				})
			}
		}
	}
</script>

<style>
	.rich-text {
		font-family: Arial, sans-serif;
		line-height: 2;
		font-size: 17px;
	}
</style>